<!--BO Main Content -->
<div class="contentWrapper" data-bind="with: selectedGrade">
	<div class="wrapper">
		<div class="testEdgeMainContent">
			<h1 class="titleMain" data-bind="text: planStatus() == 1?'Student List':'Assign Students'"></h1>
			<div class="scroll-pane7 padding20" >
				<a class="floatright" href="#" style="margin-right: 10px" onclick="backtoStudentDashboard()"> &lt; Go Back</a>
				<h2 class="title2" data-bind="text: 'Shuffle Students in '+gradeTitle()"></h2>
					<div class="paddingBottom40Top2">
						<!--BO Notification -->
						<div class="floatleft notificationBoxHeadingDailyLog notificationBoxBorder">
							<div class="floatleft marginTop5">
								<span class="bold">Notifications</span>
							</div>
							<div>
								<div style="margin-top: 3px;" class="smallwrap floatleft">

								</div>
							</div>
							<div class="floatleft marginTop5">
								<span class="redText"></span>
							</div>
						</div>
						<!-- 2nd box -->
						<div class="floatleft notificationBoxContentDailyLog notificationBoxBorder" style="width: 798px; display: inline-table;height: 36px">

							<div class="floatleft marginTop5" style="margin-top: 11px !important; margin-left: 10px;">
								<span class="redText" data-bind="text:gradeTitle()">Grade</span>
								<span class="subtext_title" data-bind=" text:' Strength: '+totalCount() + ' | Girls : Boys ratio - '+femaleCount() +' : '+maleCount()">Strength</span>
							</div>
						</div>
						<!--EO Notification  -->
					</div> <!--span class="floatleft displayInline marginRight" data-bind="text: 'Class Strengh: '+totalCount()"></span> <span data-bind="text: 'Girls : Boys ratio - '+femaleCount() +':'+maleCount()"></span--> <!--a href="#." class="te-button buttonBlue floatright marginLeft assignRoll" data-bind="click: assignRollNumbersHandler">Assign Roll Numbers</a--> <a href="#."  class="te-button buttonBlue floatright marginBottom" data-bind="visible:false">Auto Shuffle</a> <div class="clearBoth marginBottom" ></div> </span>
				<table border="1" class="schoolEventstable marginBottom">
					<thead>
						<tr class="border-bottom">
							<th class="header" style="width:80px; line-height:normal; padding:5px; vertical-align:middle;">Serial no.</th>
							<th class="header" style="width:300px; line-height:normal; padding:5px; vertical-align:middle;">Student Name</th>
							<!--th class="header" style="width:120px; line-height:normal; padding:5px; vertical-align:middle;">Academic Record(%)</th-->
							<th class="header" style="width:120px; line-height:normal; padding:5px; vertical-align:middle;">Gender</th>
							<th class="header" style="width:180px; line-height:normal; padding:5px; vertical-align:middle;">Previous Class</th>
							<!-- ko foreach:divisions -->
							<th class="header" style="width:180px; line-height:normal; padding:5px; vertical-align:middle;"><span data-bind="text:divisionTitle"></span>
							<br>
							<span style="font-weight:normal;" data-bind="text: totalCount() +'/'+ gradeCount() + ' students'">7/40 students sex ratio: 1:1.2 </span>
							<br>
							<span style="font-weight:normal;" data-bind="text: 'gender ratio: '+sexRatio()"></span></th>
							<!-- /ko -->
							<th class="header" style="width:180px; line-height:normal; padding:5px; vertical-align:middle;">New Roll Numbers</th>
						</tr>
					</thead>
					<tbody data-bind="foreach: studentList">
						<tr>
							<td data-bind="text: $index()+1"></td>
							<td><a href="#" class="studentInfo" data-bind="text: fullName,click:$parent.showStudentDetails"></a></td>
							<td data-bind="text: gender">87</td>
							<td data-bind="text: prevClassTitle">1-A</td>
							<!-- ko foreach:divisions -->
							<td>
							<input type="radio" data-bind="attr:{name:'radio'+$parentContext.$index()},click:$parent.divisionChanged,value:'true',checked:isAssigned">
							</td>
							<!-- /ko -->
							<td data-bind="text: rollNumber">1</td>
						</tr>
					</tbody>
				</table>
			</div>

			<div class="bottomButton">
				<a href="#." class="te-button buttonBlue floatleft marginLeft assignRoll" data-bind="click: assignClassesHandler">Save Class Details</a>
				<a href="#." class="te-button buttonBlue floatleft marginLeft assignRoll" data-bind="click: assignRollNumbersHandler, visible: processType()>=2">Generate Roll Number</a>
				<a href="#" class="te-button buttonGray floatleft" id="cencelBox" onclick="backtoStudentDashboard()">Cancel</a>
				<div class="clearBoth"></div>
			</div>

		</div>
	</div>
</div>
<!--EO Main Content -->

